import React, {PropTypes} from "react";
import {
	View,
	Text,
	Image,
	TouchableOpacity,
	StyleSheet,
} from "react-native";

const propTypes = {
	textStyle: Text.propTypes.style,
	imageStyle: Image.propTypes.style,
	onPress: PropTypes.func,
	text: PropTypes.string,
	source: Image.propTypes.source,
}

const CustomButton = ({
	textStyle,
	imageStyle,
	onPress,
	text,
	source,
}) => (
	<TouchableOpacity onPress={onPress} style={styles.container}>
		<Image source={source} style={styles.btnImage} />
		<Text style={styles.btnText}> {text} </Text>
	</TouchableOpacity>
)

CustomButton.propTypes = propTypes;
CustomButton.defaultProps = {
	source: null,
}

const styles = StyleSheet.create({
	container: {
		alignItems: "center",
		width: gScreen.width/4,
		paddingTop: 13,
		paddingBottom: 10,
	},
	btnImage: {
		width: 37,
		height: 37,
		marginBottom: 5,
	}, 
	btnText: {
		fontSize: 14,
	}
})

export default CustomButton;
